<template>
	<div>
		<input type="text" v-model="title" placeholder="输入您的任务" @keyup.enter="dopost">
		<button @click="dopost">提交</button>
		<hr>
		<ul>
			<li v-for="(item,index) in todo" :key="item">
				<span>{{ item }}</span>   ---
				<strong @click="fininsh(index)">完成</strong>
			</li>
		</ul>
		<hr>
		<ul>
			<li v-for="(item,index) in todook" :key="item">
				<span>{{ item }}</span>
			</li>
		</ul>
	</div>
</template>

<script>
  import {mapState} from 'vuex'

  export default {
    data() {
      return {
        title: ''
      }
    },
    computed: {
      ...mapState(['todo', 'todook'])
    },
    methods: {
      dopost() {
        this.$store.dispatch('add', this.title)
        // 清空一下
        this.title = ''
      },
      fininsh(index){
        this.$store.dispatch('ok', index)
			}
    }
  }
</script>

<style scoped>

</style>
